<div th:fragment="add-patient" id="add-patient" style="display: none">
    <div class="block-header">
        <div class="row">
            <div class="col-lg-7 col-md-6 col-sm-12">
                <h2>Add Patient
                    <small class="text-muted">Welcome to Compass</small>
                </h2>
            </div>
            <div class="col-lg-5 col-md-6 col-sm-12">
                <ul class="breadcrumb float-md-right">
                    <li class="breadcrumb-item"><a href="/hospital/index"><i class="zmdi zmdi-home"></i> Compass</a></li>
                    <li class="breadcrumb-item" onclick="backPatient()"><a href="javascript:void(0);">Patient</a></li>
                    <li class="breadcrumb-item active"><a href="javascript:void(0);">Add Patient</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="container-fluid">
        <div class="row clearfix">
            <div class="col-lg-12 col-md-12 col-sm-12">
                <div class="card">
                    <div class="header">
                        <h2><strong>Basic</strong> Information <small></small> </h2>
                        <ul class="header-dropdown">
                            <li class="dropdown"> <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> <i class="zmdi zmdi-more"></i> </a>
                                <ul class="dropdown-menu dropdown-menu-right slideUp float-right">
                                    <li><a href="javascript:void(0);">Edit</a></li>
                                    <li><a href="javascript:void(0);">Delete</a></li>
                                    <li><a href="javascript:void(0);">Report</a></li>
                                </ul>
                            </li>
                            <li class="remove">
                                <a role="button" class="boxs-close"><i class="zmdi zmdi-close"></i></a>
                            </li>
                        </ul>
                    </div>
                    <div class="body">
                            <div class="row clearfix">
                                <div class="col-sm-4">
                                    <div class="form-group">
                                        <input type="text" id="name" class="form-control" placeholder="患者姓名" required>
                                    </div>
                                </div>
                                <div class="col-sm-3" style="margin-top: -5px">
                                    <select class="form-control show-tick" id="sex">
                                        <option value="0">- 性别 -</option>
                                        <option value="1">男</option>
                                        <option value="2">女</option>
                                    </select>
                                </div>
                                <div class="col-sm-4">
                                    <div class="form-group">
                                        <input type="text" class="form-control" placeholder="联系方式" id="phone" required>
                                    </div>
                                </div>
                            </div>
                            <div class="row clearfix">
                                <div class="col-sm-3">
                                    <div class="form-group m-t-5">
                                        <input type="number" class="form-control" placeholder="年龄" id="age" required>
                                    </div>
                                </div>
                                <div class="col-sm-3">
                                    <div class="form-group m-t-5">
                                        <input type="datetime-local" class="form-control" placeholder="接诊时间" id="startPatientTime"  required>
                                    </div>
                                </div>
                            </div>
                            <div class="row clearfix">
                                <div class="col-lg-12 col-md-12 col-sm-12">
                                    <input type="hidden" value="" id="p_filenames">
                                    <form action="/" id="frmFileUpload2" class="dropzone" method="post" enctype="multipart/form-data">
                                        <div class="dz-message">
                                            <div class="drag-icon-cph"> <i class="material-icons">touch_app</i> </div>
                                            <h3>点击此处或拖拽文件到此处上传.此处上传皆为治疗前图片</h3>
                                            <em>(文件格式支持:*.jpg,*.gif,*.png,*.jpeg,*.webp.一次最多上传 <strong>8</strong> 个图片文件,单个文件最大15MB,文件会自动上传到服务器。)</em> </div>
                                        <div class="fallback">
                                            <input name="file" type="file" multiple />
                                        </div>
                                    </form>
                                </div>
                            </div>

                            <div class="row clearfix">
                                <div class="col-sm-12">
                                    <div class="form-group">
                                        <textarea rows="4" class="form-control no-resize" placeholder="此处填写病例摘要" id="describe"></textarea>
                                    </div>
                                </div>
                                <div class="col-sm-12">
                                    <button onclick="addPatient()" type="button" class="btn btn-primary btn-round">提交</button>
                                    <button type="button" class="btn btn-default btn-round btn-simple" onclick="backPatient()">取消</button>
                                </div>
                            </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">

        function addPatient() {
            var name =  $('#name').val()
            var sex =  $('#sex').val()
            var phone = $('#phone').val()
            var age = $('#age').val()
            var startTime = $('#startPatientTime').val()
            var profile = $('#describe').val()
            var image = $('#p_filenames').val()
            if (name===""||sex===-1||phone===""||profile===""||startTime==="") {
                alert("请填写所有字段信息！")
            }
            else {
                $.ajax({
                    //请求路径
                    url: "/hospital/addPatient",
                    //请求类型
                    type: "POST",
                    //data表示发送的数据
                    data: JSON.stringify({
                        name:name,
                        sex:sex,
                        phone:phone,
                        age:age,
                        startTime:startTime,
                        profile:profile,
                        images: image
                    }), //定义发送请求的数据格式为JSON字符串
                    contentType: "application/json;charset=utf-8",
                    //定义回调响应的数据格式为JSON字符串，该属性可以省略
                    dataType: "json",
                    //成功响应的结果
                    success: function (data) {
                        if (data.code===200) {
                            alert("添加患者信息成功！")
                            $('#p_filenames').val('')
                            backPatient()
                            Dropzone.forElement("#frmFileUpload2").removeAllFiles(true);
                        }
                        else {
                            alert("添加患者信息失败，原因："+data.msg)
                            backPatient()
                            Dropzone.forElement("#frmFileUpload2").removeAllFiles(true);
                        }
                        $('#name').val("")
                        $('#sex').selectpicker('val',0);
                        $('#phone').val("")
                        $('#age').val("")
                        $('#startPatientTime').val("")
                        $('#describe').val("")
                        $('#p_filenames').val("")

                    },
                })
            }
        }
    </script>

</div>


